<template>
	<u-cell-group>
		<u-cell-item :arrow="false" title="门店名称">
			<u-input :customStyle="customStyle" v-model="form.Dealer_BaseInfo.Name" input-align="right" placeholder="请输入门店名称"></u-input>
		</u-cell-item>
		<u-cell-item :arrow="false" title="门店简称">
			<u-input :customStyle="customStyle" v-model="form.Dealer_BaseInfo.Referred" input-align="right" placeholder="请输入门店简称"></u-input>
		</u-cell-item>
		<u-cell-item :arrow="false" title="门店负责人姓名">
			<u-input :customStyle="customStyle" v-model="form.Dealer_BaseInfo.NickName" input-align="right" placeholder="请输入门店负责人姓名"></u-input>
		</u-cell-item>
		<u-cell-item v-model="form.Mobile" :arrow="false" title="门店负责人手机号">
			<u-input :customStyle="customStyle" v-model="form.Dealer_BaseInfo.Mobile" input-align="right" placeholder="请输入门店负责人手机号"></u-input>
		</u-cell-item>
		<u-cell-item v-if="loadCity" :arrow="false" title="门店地址" @click="showAddressSelect = true">
			<city-select v-model="areaCode" @city-change="onCityChange"></city-select>
			<u-input :customStyle="customStyle" v-model="form.Dealer_BaseInfo.Address" inputAlign="right" placeholder="详细地址"></u-input>
		</u-cell-item>

		<block v-show="showGrade">
			<u-cell-item required title="门店等级" :arrow="false">
				<u-radio-group v-model="form.Dealer_OtherInfo.DealerGrade">
					<u-radio :name="item.Key" v-for="(item, index) in metadata.DealerGrade_BaseList" :key="index">{{ item.Value }}</u-radio>
				</u-radio-group>
			</u-cell-item>
		</block>

		<block v-if="showAudit">
			<review-flow :data="form.AuditForList"></review-flow>
		</block>

		<block v-if="showApplyReason">
			<u-cell-item :arrow="false" title="申请原因">
				<u-radio-group v-model="form.ApplyForReasonId">
					<view class="grid-2">
						<u-radio :label-size="26" v-for="(item, index) in metadata.DealerApplyFor_BaseList" :name="item.Key" :key="index">{{ item.Value }}</u-radio>
					</view>
				</u-radio-group>
			</u-cell-item>
			<u-cell-item v-if="form.ApplyForReasonId == 3" :arrow="false" title="物料需求">
				<u-checkbox-group @change="onRequirementsChange">
					<view class="grid-2">
						<u-checkbox :label-size="26" v-model="item.checked" v-for="(item, index) in metadata.DealerMaterialRequirements_BaseList" :name="item.Key" :key="index">
							{{ item.Value }}
						</u-checkbox>
					</view>
				</u-checkbox-group>
			</u-cell-item>
			<u-cell-item v-if="form.ApplyForReasonId == 4" :arrow="false" title="费用需求">
				<u-checkbox-group @change="onRequirementsChange">
					<view class="grid-2">
						<u-checkbox :label-size="26" v-model="item.checked" v-for="(item, index) in metadata.DealerMoneyRequirements_BaseList" :name="item.Key" :key="index">
							{{ item.Value }}
						</u-checkbox>
					</view>
				</u-checkbox-group>
			</u-cell-item>
			<u-cell-item v-if="form.ApplyForReasonId == 5" :arrow="false" title="其他备注">
				<u-input :customStyle="customStyle" v-model="form.OtherNote" :autoHeight="true" type="textarea" inputAlign="right" placeholder="其他备注"></u-input>
			</u-cell-item>
		</block>
		<u-cell-item title="备注" :arrow="false">
			<u-input :customStyle="customStyle" v-model="form.Remark" type="textarea" :autoHeight="true" inputAlign="right" placeholder="备注"></u-input>
		</u-cell-item>
	</u-cell-group>
</template>
<script>
export default {
	name: 'store-information-form',
	props: {
		data: {
			type: Object,
			default() {
				return {
					Dealer_BaseInfo: {},
					Dealer_OtherInfo: {},
					DealerDetail_Audit: {}
				};
			}
		},
		showApplyReason: {
			type: Boolean,
			default: true
		},
		showGrade: {
			type: Boolean,
			default: false
		},
		showAudit: {
			type: Boolean,
			default: false
		},
		loadCity: {
			type: Boolean,
			default: true
		},
		metadata: {
			type: Object,
			default() {
				return {
					BusinessCategory_BaseList: [],
					CompetingGoodsBrandA_BaseList: [],
					CompetingGoodsBrandB_BaseList: [],
					CompetingGoodsBrandC_BaseList: [],
					DealerApplyFor_BaseList: [],
					DealerGrade_BaseList: [],
					DealerMaterialRequirements_BaseList: [],
					DealerMoneyRequirements_BaseList: [],
					DealerShutDown_BaseList: [],
					DealerType_BaseList: [],
					DealerAndGoReason_BaseList: []
				};
			}
		}
	},
	data() {
		return {
			customStyle: {
				fontSize: '26rpx'
			},

			showAddressSelect: false,
			areaCode: [],
			form: {
				ApplyForReasonId: null,
				Requirements: '',
				OtherNote: '',
				Remark: '',
				DealerGrade: '',

				Dealer_BaseInfo: {
					// 门店名称
					Name: '',
					// 简称
					Referred: '',
					// 门店负责人姓名
					NickName: '',
					// 门店负责人手机号
					Mobile: '',
					// 门店地址
					ProvinceId: null,
					CityId: null,
					DistrictId: null,
					// 门店详细地址
					Address: null
				},
				Dealer_OtherInfo: {
					BlessingNote: '',
					BossBirthday: null,
					BossName: '',
					BossPhone: '',
					BusinessCategory: '',
					BusinessLicenseA: '',
					CompetingGoodsBrandA: '',
					CompetingGoodsBrandB: '',
					CompetingGoodsBrandC: '',
					DealerGrade: null,
					DealerType: null,
					IsSign: null,
					IsVIP: null,
					LastYearsBDRSales: null,
					PeopleNum: null,
					PercentageBDRSales: null,
					TotalSales: null,
					TreatyPhoto: '',
					TreatyPhotoType: null
				},
				DealerDetail_Audit: {
					ApplayRemark: '',
					ApplayTime: null,
					AuditState: null,
					AuditStateName: '',
					// 终审
					FinalAuditNote: '',
					// 初审
					FirstAuditNote: '',
					// 复审
					ReviewAuditNote: ''
				},
				AuditForList: [],
			}
		};
	},
	methods: {
		onRequirementsChange(e) {
			this.form.Requirements = e.toString();
		},

		initForm(data) {
			if(data.Dealer_BaseInfo) {
				this.form.Dealer_BaseInfo = Object.assign(this.form.Dealer_BaseInfo, data.Dealer_BaseInfo);
				this.areaCode = [data.Dealer_BaseInfo.ProvinceId, data.Dealer_BaseInfo.CityId, data.Dealer_BaseInfo.DistrictId]
			}
			if(data.Dealer_OtherInfo) {
				this.form.Dealer_OtherInfo = Object.assign(this.form.Dealer_OtherInfo, data.Dealer_OtherInfo);
			}
			if(data.DealerDetail_Audit) {
				this.form.DealerDetail_Audit = Object.assign(this.form.DealerDetail_Audit, data.DealerDetail_Audit);
			}
			
			if(data.ApplyForReasonId) {
				this.form.ApplyForReasonId = data.ApplyForReasonId
			}
			
			if(data.OtherNote) {
				this.form.OtherNote = data.OtherNote
			}
			
			this.form.AuditForList = data.AuditForList;
		},

		onCityChange(e) {
			if (e.province) {
				this.form.Dealer_BaseInfo.ProvinceId = e.province.value;
			}
			if (e.city) {
				this.form.Dealer_BaseInfo.CityId = e.city.value;
			}
			if (e.area) {
				this.form.Dealer_BaseInfo.DistrictId = e.area.value;
			}
		}
	}
};
</script>

<style lang="scss"></style>
